{% extends 'baes.html'%}
{% block style %}
	<style>
		h1{
			
			font-family: '楷体' !important; 
		}
		.mydiv{
			background-color: #eeeeee;
			width: 100vw !important;
			padding-left:20vw !important; 
		}
		th{
			background: #eee;
		}
		.mybutton{
			margin-top:10px;
			margin-right: 10px;
			margin-bottom:10px;  
		}
		#a1{
			color: white;
		}
	</style>
{% endblock %}
{% block content %}
<header>
	<div class="container mydiv">
		<h1>课程管理</h1>
	</div>
</header>

<div class="container">
	<div class="row clearfix">
		<div class="col-md-12 column">
			
			<div class="btn-group mybutton">
				<button type="button" class="btn btn-primary">{{kind.name}}</button>
				<button type="button" class="btn btn-primary dropdown-toggle" 
						data-toggle="dropdown">
					<span class="caret"></span>
					<span class="sr-only">切换下拉菜单</span>
				</button>
				<ul class="dropdown-menu">
						{% for item in kinds%}
						<li>
							<a href="/course/{{item.id}}">{{item.name}}</a>
						</li>
						{% endfor %}
					
				</ul>
				
			</div><a id="a1" href="/add/course/{{kind.id}}"><button type="button" class="btn btn-info btn-default glyphicon glyphicon-plus">添加</button></a>
			<div class="table-responsive">
				<table class="table table-hover table-bordered">
					<thead>
						<tr>
							<th class="text-center">
								课程名称
							</th>
							<th class="text-center">
								课程介绍
							</th>
							<th class="text-center">
								视频
							</th>
							<th class="text-center">
								编辑
							</th>
							<th class="text-center">
								删除
							</th>
						</tr>
					</thead>
					<tbody class="text-center">
						{% for cou in course %}
						<tr>
							
							<td>
								{{cou.title}}
							</td>
							<td>
								{{cou.abstract}}
							</td>
							<td>
								<a class="glyphicon glyphicon-facetime-video" href="/videos/{{cou.id}}"></a>
							</td>
							<td>
								<a class="glyphicon glyphicon-edit" href="/update_cou/{{cou.id}}"></a>
							</td>
							<td>
								<a class="glyphicon glyphicon-trash" href="#" onclick="removemodel('{{cou.id}}','{{cou.title}}')"></a>
							</td>
							
						</tr>
						{% endfor %}
					</tbody>
				</table>
			</div>
			
		</div>
	</div>
</div>


<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">确定要删除吗？</h4>
            </div>
            <div class="modal-body">在这里添加一些文本</div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary remove">提交更改</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>


{% endblock %}




{% block script %}
<script type="text/javascript" src="/static/course.js"></script>
{% endblock %}